import { action, computed, makeObservable, observable } from "mobx"



class TodoStore {
  

  constructor() {
    makeObservable(this, {
     // 存放列表数据数组
     todos: observable,
     filter: observable,
     addLists: action.bound,
     deleteLists: action.bound,
     changeStatus: action.bound,
     cleantodos: action.bound,
     unFinishTodoCount: computed,
     changeFilter: action.bound,
     filterTodo: computed
    })
  }
  todos = []
  // 筛选条件
  filter = 'All'
  // 添加任务
  addLists(taskName){
    this.todos.push({
      taskName,
      // 定义任务状态的初始值
      isCompleted: false
    }) 
  }
  // 删除任务
  deleteLists(index){
    this.todos.splice(index, 1)
  } 
  // 修改任务状态
  changeStatus(index, tag ){
    this.todos[index].isCompleted = tag
  }
  // 计算未完成任务的数量
  get unFinishTodoCount() {
    return this.todos.filter(todo => todo.isCompleted === false).length
  }
  // 修改筛选条件
  changeFilter(condition) {
    this.filter  = condition
  }
  // 监测筛选条件的变化 根据筛选条件对任务进行筛选 
  get filterTodo(){
    switch (this.filter){
      case 'All':
        return this.todos
      case 'Active':
        return this.todos.filter(todo => todo.isCompleted === false)
      case 'Completed':
        return this.todos.filter(todo => todo.isCompleted === true)
      default:
      return this.todos
    }
  }
  // 清除所有被选中的选项====从任务列表中筛选出未完成的任务列表
  cleantodos() {
    // 让任务列表过滤出未选择的todos
    this.todos = this.todos.filter(todo => todo.isCompleted === false)
  }
}
const todo = new TodoStore()

export default todo